<template>
  <div>
    <el-card class="box-card" :body-style="{padding:'5px'}">
      <div class="clearfix" style="padding:5px;">
        <span style="line-height: 36px;">详情</span>
      </div>

      <el-form ref="form" :model="form" label-width="120px">

        <el-row>
          <el-col :span="12">
            <el-form-item label="用户账户:" prop="userMobile">
              <el-input v-model="form.userMobile" placeholder="输入用户账户" :disabled="true" style='width: 100%'></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="用户反馈ID:" prop="feedbackId">
              <el-input v-model="form.feedbackId" placeholder="输入用户反馈ID" :disabled="true" style='width: 100%'></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="解决状态:" prop="feedbackIsResolve">
              <el-select v-model="form.feedbackIsResolve" placeholder="是否解决" :disabled="disableForm"
                         style='width: 100%'>
                <el-option label="解决" value="1"></el-option>
                <el-option label="未解决" value="0"></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="是否有效:" prop="feedbackType">
              <el-select v-model="form.feedbackType" placeholder="是否有效" :disabled="disableForm" style='width: 100%'>
                <el-option label="有效" value="1"></el-option>
                <el-option label="无效" value="0"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-form-item label="解决方案:" prop="feedbackResolve">
            <el-input type="textarea" :autosize="{ minRows: 4, maxRows: 6}" placeholder="Input Description"
                      v-model="form.feedbackResolve" :disabled="disableForm">
            </el-input>
          </el-form-item>
        </el-row>

        <el-form-item>
          <el-button type="info" @click="saveHandler" :disabled="disableForm">保存</el-button>
          <el-button type="danger" @click="resetHandler" :disabled="disableForm">取消</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>


<script type="text/babel">
  import assignDeep from 'assign-deep'
  import {mapActions} from 'vuex'

  import suggestionStore from './bll/suggestionStore'
  import store from '../../store'

  (!store.state.suggestionStore) && store.registerModule('suggestionStore', suggestionStore)

  export default {
    data() {
      return {
        disableForm: true,
        pageModel: 'ADD',
        form: {
          feedbackIsResolve: '',
          feedbackType: '',
          feedbackResolve: '',
          userMobile: '',
          feedbackId: ''
        }
      }
    },

    props: {
      param: {
        type: Object
      },
      mode: {
        type: String
      }
    },

    watch: {
      param(record) {
        if (record) {
          this.form.feedbackIsResolve = record.feedbackIsResolve;
          this.form.feedbackType = record.feedbackType;
          this.form.feedbackResolve = record.feedbackResolve;
          this.form.userMobile = record.userMobile;
          this.form.feedbackId = record.feedbackId;
        } else {
          assignDeep(this.form, {
            feedbackIsResolve: '',
            feedbackType: '',
            feedbackResolve: '',
            userMobile: '',
            feedbackId: ''
          });
        }
      },
      mode(val) {
        this.pageModel = val;
      }
    },

    mounted() {
      this.initPage();
    },

    methods: {
      ...mapActions(['editSuggesion']),
      saveHandler() {
        var newform = this.form
        if (this.form.feedbackIsResolve === '解决') {
          newform.feedbackIsResolve = '1'
        } else if (this.form.feedbackIsResolve === '未解决') {
          newform.feedbackIsResolve = '0'
        }
        if (this.form.feedbackType === '有效') {
          newform.feedbackType = '1'
        } else if (this.form.feedbackType === '无效') {
          newform.feedbackType = '0'
        }
        var data = this.editSuggesion({formData: newform})
        console.log(this.form)
        console.log(data)
        if (data) {
          this.$message({
            message: '修改成功',
            type: 'success'
          });
          if (this.$parent.form.region === 'wuxiao') {
            this.$parent.searchSuggestions({
              feedbackType: 0,
              pageIndex: this.$parent.pageIndex,
              pageSize: this.$parent.pageSize
            });
          } else if (this.$parent.form.region === 'youxiao') {
            this.$parent.searchSuggestions({
              feedbackType: 1,
              pageIndex: this.$parent.pageIndex,
              pageSize: this.$parent.pageSize
            });
          } else {
            this.$parent.querySuggestions({pageIndex: this.$parent.pageIndex, pageSize: this.$parent.pageSize});
          }
        }
      },

      resetHandler() {
        this.$refs.form.resetFields();
        this.disableForm = true;
      },

      initPage() {

      },

      // interface for invoking

      disable() {
        this.disableForm = true;
      },
      enable() {
        this.disableForm = false;
      },
      clear() {
        this.$refs.form.resetFields();
      }

    }
  }
</script>

